<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>客户合并-XToolsCRM</title>
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="http://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript" src="js/axios.js"></script>
<script type="text/javascript" src="js/qs.js"></script>


<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/icons.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">

<link href="../css/zcss/bootstrap-datepicker3.min.css" rel="stylesheet">
<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">

<!--图标的外部样式-->
<link href="http://cdn.xtcrm.com/cdn//v7/fm/ub/css/icons.css"
	rel="stylesheet" type="text/css">
<!--图标的外部样式-->

<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">
</head>
<body style="height: 700px;">
	<iframe name="CalFrame" width="144" height="192" id="CalFrame"
		src="/css/calendar.htm"
		style="display: none; position: absolute; z-index: 100; border: 0"></iframe>
	<script type="text/javascript">
</script>
	<div class="enlarged forced" id="wrapper">
		<!-- modal qlist fields ---->
		<div tabindex="-1" class="modal fade in" id="modal_list_field"
			role="dialog" aria-hidden="true" aria-labelledby="myModalLabel"
			style="display: none;">
			<div class="modal-dialog">
				<div class="modal-content">
					<form name="form1" id="frm_list_field" action="anniForm"
						method="post" target="qssub" novalidate="">
						<div class="modal-header">
							<button class="close" aria-hidden="true" type="button"
								data-dismiss="modal">×</button>
							<h4 class="modal-title">客户查询</h4>
						</div>
						<div class="modal-body modal-checkbox p-l-40"></div>
						<div class="modal-footer">
							<button class="btn btn-default waves-effect"
								id="btn_list_fields0" type="button">确定</button>
							<button class="btn btn-info waves-effect waves-light"
								id="btn_list_fields1" type="button">还原初始</button>
						</div>
						<input name="key" type="hidden" value=""> <input
							name="type" type="hidden" value="0">
					</form>
				</div>
			</div>
		</div>

		<!--UTF8-->
		<div class="content-page" style="min-height:1100px; margin: 0;">
			<div class="content " style="margin: 0;">
				<div class="container-fluid"  style="height: 1200px;">
					<script src="/css/jqp.js"></script>
					<script>
							var nos = 'sid=112&ssn=2hs1m7sa6v7ic2rcfd283qsg03&ccn=d002&cr=e9ffde2a34dd73cf49c9903326dc63c5';
						</script>
					<h4>
						<b><i class="md md-call-merge m-r-5"></i>客户合并</b>
					</h4>
					<el-form :model="anniForm" :rules="rules" ref="anniForm"
						name="pageact" id="mtsese" class="m-t-20 m-l-20" action="anniForm"
						method="POST" novalidate=""> <input name="mdb"
						type="hidden" value="08f086">
					<div class="row m-l-20">
						<div class="col-sm-4">
							<p>
								<b>从</b>
							</p>
							<el-form-item prop="aname"> 
									<el-input v-model="anniForm.aname" disabled></el-input>
								 </el-form-item>
							<div class="form-inline m-t-10 m-b-10">
								<div class="form-group m-r-10">
									<el-form-item prop="state2">
									 	<el-autocomplete class="inline-input" v-model="anniForm.aname" 
									 	:fetch-suggestions="querySearch" placeholder="编号,关键字"
									 	:trigger-on-focus="false"
					                      @select="handleSelect">
					               </el-autocomplete>
									</el-form-item>
								</div>								
							</div>
						</div>
						<div class="col-sm-2 text-center">
							<i class="fa fa-angle-double-right fa-4x"></i>
						</div>
						<div class="col-sm-4">
							<p>
								<b>并入到</b>
							</p>
							<el-form-item prop="aname1"> 
							<el-input
								name="dt_contact_cu_id_a" v-model="anniForm.aname1" disabled
								id="dt_contact_cu_id_a"></el-input>
							</el-form-item>
							
							<div class="form-inline m-t-10 m-b-10">
								<div class="form-group m-r-10">
									<el-form-item prop="aname1"> 
									<el-autocomplete
										v-model="anniForm.aname1" :fetch-suggestions="querySearchse"
										@select="handleSelectse" name="dt_contact_cu_id_b"
										:trigger-on-focus="false"
										id="dt_contact_cu_id_b" style="width:140px;margin-left:10px;"
										type="text" placeholder="拼音头.编号.关键字" autocomplete="off">
									</el-autocomplete> </el-form-item>									
								</div>								
							</div>
						</div>
					</div>
					<p>
						<b>注意：</b>
					</p>
					<ol>
						<li>执行合并后，<b>左侧客户基本信息被删除进入回收站，其客户视图内其它数据合并入右侧客户，右侧客户保留</b>。
						</li>
						<li>在合并前，应检查左侧客户是否有未执行完的批量任务，如有请先结束批量任务。是否有属于某项目的情况，如有则不允许被合并。</li>
						<li><font color="#ff0000"><b><span
									class="text-danger">合并操作不可恢复！</span></b></font>请执行前检查确认客户选择是否正确。</li>
					</ol>
					<p class="text-center">
						<el-button :plain="true" @click="submitForm('anniForm')">执行合并</el-button>
						<!-- <input name="B1" class="btn btn-d w-lg" type="submit" value="执行合并"> -->
					</p>
					<p>

						<font color="#008000">查看历史合并记录：</font> <el-button
							@click="centerVisible()"
						class="bmenu"
							
							target="_blank"><img src="/images/icons/pe2.png">合并日志</el-button>
							</p>
							  <div v-if="iswindow" style="height:500px;border:solid 1px #ccc;">
								<iframe src="/selectkehubing"
													width="100%" frameborder="0"  :visible.sync="centerDialogVisibleses"
													onload="this.height=this.contentWindow.document.body.scrollHeight,this.width = this.contentWindow.document.body.scrollWidth"></iframe>
			
							</div>
							<div style="height: 50px; border: #ccc solid 1px; ">
							  
							</div>
					</el-form>
					<script>
							var vm = new Vue({
								el: "#mtsese",
								data() {
									
									return {
										restaurants:[],
										restarray:[],
										iswindow:false,
										centerDialogVisibleses:false,
										anniForm: {
											aname:"",
											aname1:"",																			
										},
										rules: {
											aname: [{
												required: true,
												message: '请输入客户',
												trigger: 'blur'
											}],
											aname1: [{
												required: true,
												message: '请输入客户',
												trigger: 'blur'
											}]
										}
									}
									
								},
								methods: {
									handleSelect: function(it) {
										//console.log(it+"            it");
										//alert(it+"           it");
										vm.restarray=[];
										for(var j in vm.restaurants){
											if(it!=vm.restaurants[j]){
												vm.restarray.push(vm.restaurants[j]);
											}
										}
										console.log(vm.restarray+"    restarray")
										//, restarra
									},
									handleSelectse: function(it) {
										console.log(it+"            itse");
									},
									centerVisible:function(){
										//alert("fuckawe");
										iswindow:true
									},
									querySearch: function(queryString, cb) {									
										var result = []; 
										console.log(vm.restaurants+"    restaurants");
										//遍历所有的选项
										vm.restaurants.forEach(v => {
											//如果文本框中的值和选项相符,则返回该选项
											if(v.value.indexOf(queryString)>= 0) {
												//alert(v);
												result.push(v);
												
												/* console.log(result+"    result")
												console.log(v.data+"    result") */
											//	alert(v);
											}
										})
										//将结果传递给回调函数,显示在最终的建议列表处
										//cb(result);
										
										cb(result);
									}, 
									querySearchse: function(queryString, cb) {									
										var resultse = []; 
										console.log(vm.restaurants+"    restaurants");
										//遍历所有的选项
										vm.restarray.forEach(v => {
											//如果文本框中的值和选项相符,则返回该选项
											if(v.value.indexOf(queryString)>= 0) {
												resultse.push(v);
											}
										})
										cb(resultse);
									},
									centerVisible(){
										//alert("xlxmldldm");
										this.iswindow=true;
										this.centerDialogVisibleses=true;
										alert(this.centerDialogVisibleses);
									},
									submitForm(anniForm) {
										/*	console.log(famoney);*/
							    	//验证方法
							        this.$refs[anniForm].validate((valid) => {
							          if (valid) {
							        	  //post提交数据
							           	axios.post("/anniForm",
							           			//参数转换
							           			Qs.stringify(this.anniForm,{arrayFormat: 'brackets'})
							           		//	params:
							           			//ajax请求成功的回调函数
							           			).then(function(v){
							           			console.log("回调成功，获取了服务器端返回的值v");							           			
							           			alert(v.data.typese);
							           		    window.location.reload();
							           			console.log(v);
							           	}).catch(function(){
							           		//alert("存在未完成的订单");
							           	});							        	  							        	  
							          } else {
							            console.log('error submit!!');
							            return false;
							            
							          }							         
							        });				
							        axios.post("/customer/kehuhebing",
											//参数转换
											Qs.stringify(this.ruleForm, {
												arrayFormat: 'brackets'
											})		
										).then(function(v) {
											
										}).catch(function(e) {
											alert("出错了"+e);
										});	
							       
									}
								
								},mounted() {
									var iosnn=this;
									//post提交数据
									axios.post("/selectcusethebing",
										//参数转换
										Qs.stringify(this.anniForm, {
											arrayFormat: 'brackets'
										})		
									).then(function(v) {
										vm.restaurants=v.data;
										 console.log(vm.restaurants+"             restaurantsdates");
										// iosnn.restaurants = v.data;
										 console.log(vm.restaurants);
										// console.info(v.data);
									}).catch(function(e) {
										alert("出错了"+e);
									});
									//this.restaurants=iosnn.result;
								}
							});
						</script>
				</div>
			</div>
		</div>
		<div id="ids">
			
		</div>
		<script type="text/javascript">
		/* function goBrandPage() {
			$("ids").load("kehuhebingjilu.jsp");
			return false;
		} */
		
		
		
		</script>
	</div>
</body>




</html>